<template>
	<div class="gk-layout-container">
		<div class="gk-layout-header">
			<!--工具栏-->
			<s-query perms="core:stockDetail" @click="findPage" @addClick="handleAdd">
				<s-item v-model="filters.itemId"></s-item>
				<el-form-item>
					<el-input v-model.trim="filters.boxCode" placeholder="请输入盘码"></el-input>
				</el-form-item>
				<s-dict-other name="storeStatus" v-model="filters.storeStatus"> </s-dict-other>
				<s-date @dateChange="function (v) { filters.beginTime = v }" placeholder="时间" />
			</s-query>
			<s-reflash reflash="true" excel="true" @findPage="findPage"  
				@exportExcel="exportExcel">
			</s-reflash>
		</div>
		<!--表格内容栏-->

		<div class="gk-layout-main">
			<my-table :data="pageResult.content" :loading="loading">
				<el-table-column :label="$t('action.desc')" width="50" header-align="center" align="center">
					<template slot-scope="scope"> {{ scope.$index + 1 }} </template>
				</el-table-column>
				<column prop="itemId" label="物料名称" header-align="left" align="left" width="450" :formatter="itemFilter" />
				<column prop="countDb" label="数量" :formatter="countFormat" />
				<column prop="status" label="状态" :formatter="selectionFormat1" />
				<column prop="boxCode" label="托盘码" />
				<column prop="rLocId" label="位置" />
				<column prop="changeTime" label="出库时间" width="140" />
				<el-table-column header-align="center" align="center" width="250" :label="$t('action.operation')">
					<template slot-scope="scope">
						<kt-button label="查看" perms="core:stockDetail:view" v-if="scope.row.status != 2"
							@click="handleShow(scope.$index, scope.row, false)" />
					</template>
				</el-table-column>
			</my-table>
		</div>
		<!--分页栏-->
		<div class="toolbar gk-layout-footer" style="padding:10px;">
			<el-pagination layout="total, prev, pager, next, jumper" @current-change="findPage"
				:current-page="filters.pageNum" :page-size="filters.pageSize" :total="pageResult.totalSize"
				style="float:right;">
			</el-pagination>
		</div>

		<core-stock-Det :detDialogVisible="dialogVisible" :editCount=operation :id=det.id @myClose="handleClose"
			@onSubmitForm="saveDet" />

	</div>
</template>

<script>
import KtButton from "@/views/Core/KtButton"
import MyTable from "@/views/Core/MyTable"
import Column from "@/views/Core/Column"
import SItem from "@/components/Kj/SItem"
import SDict from "@/components/Kj/SDict"
import SDictOther from "@/components/Kj/SDictOther"
import SReflash from "@/components/Kj/SReflash"
import SQuery from "@/components/Kj/SQuery"
import { format } from "@/utils/datetime"
import { addHtmlTd } from "@/utils/LodopFuncs"
import SDate from "@/components/Kj/SDate"
import { getItemName, dictsFormat } from "@/utils/myUtil"
import KtDeleteButton from "@/views/Core/KtDeleteButton"
import { validatorNumber } from "@/utils/validate"
import CoreStockDet from "@/dialog/CoreStockDet"
export default {
	components: {
		KtButton,
		Column,
		MyTable,
		SQuery,
		CoreStockDet,
		SItem,
		SDict,
		SDictOther,
		SReflash,
		SDate,
	},
	data() {
		return {
			size: "mini",
			filters: {
				batchNo: '', pageNum: 1, pageSize: this.global.pageSize,
				pid: -1, storeStatus: -1
			},
			operation: true,
			loading: false,
			dialogVisible: false,
			det: { id: 0, pid: 0, pkId: 0, status: 2 },
			pageResult: {}

		}
	},
	methods: {
		// 获取分页数据
		findPage: function (data) {
			if (data != -1) {
				data = data || 1
				this.filters.pageNum = data

			}
			this.filters.storeStatus = -1;
			this.$api.coreStockDet.findDetailPage(this.filters).then((res) => {
				this.pageResult = res.data
			})
		},


		handleAdd: function () {
			this.dialogVisible = true
			this.operation = true
			this.det = { id: 0, pid: 0, pkId: 0, status: 2 }
		},
		saveDet: function (d) {
			this.det.countDb = d.countDb
			this.$api.coreStockDet.saveStockDet(this.det).then((res) => {
				if (res.code == 200) {
					this.$message({ message: this.$t('action.operateSucess'), type: 'success' })
					this.findPage(-1)
					this.handleClose()
				} else {
					this.$message({ message: this.$t('action.operateFail') + res.msg, type: 'error' })
				}

			})
		},
		handleClose: function () {
			this.dialogVisible = false;
		},
		getKey: function (arg) {
			return this.$t(arg)
		},

		//导出的方法
		exportExcel(xlsExport) {
			this.filters.pageSize = -1
			this.$api.coreStockDet.findDetailPage(this.filters).then((res) => {
				const tHeader = ['物料名称', '数量', '状态', '托盘码', '位置', '出库时间'];
				const filterVal = ['itemId', 'countDb', 'status', 'boxCode', 'rLocId', 'changeTime'];
				const list = res.data.content;
				for (var i = 0; i < list.length; i++) {
					if (list[i].countDb < 1) {
						var d = list[i].countDb
					}
					list[i].itemId = getItemName(list[i].itemId);
				}
				xlsExport(tHeader, filterVal, list, '库位库存导出');
			})
		},
		selectionFormat1: function (row, column, cellValue, index) {
			return dictsFormat("storeStatus", cellValue)
		},

		itemFilter: function (row, column, cellValue, index) {
			var item = getItemName(cellValue)
			return item;
		},

		countFormat: function (row, column, cellValue, index) {
			return cellValue + dictsFormat("units", row.unit)
		},

		// 显示编辑界面
		handleShow: function (params, row, op) {
			this.det.id = row.id
			this.operation = op;
			this.dialogVisible = true


		},
		// 时间格式化
		dateFormat: function (row, column, cellValue, index) {
			return format(row[column.property])
		}
	},

	mounted() {

		this.size = this.global.gSize;
		this.findPage(1);
	}
}
</script>

<style scoped></style>